<template>
  <div
    class="login-container"
    :style="{
      background:
        'url(' +
        require('@/assets/Images/AppIcon/icon_login_top.png') +
        ') no-repeat',
      backgroundSize: '100% 200px',
    }"
  >
    <div class="login-box">
      <div class="img-box">
        <img src="@/assets/Images/AppIcon/common_default_header.png" alt="" />
      </div>
      <div class="form-box">
        <van-form style="margin-top: 80px">
          <div class="phone">
            <van-row>手机号/登录账号</van-row>
          </div>
          <van-field
            v-model="AccountCode"
            class="login-input"
            :rules="[{ required: true, message: '请填写用户名' }]"
          />
          <div class="password">
            <van-row>登录密码</van-row>
          </div>
          <van-field
            v-model="Password"
            type="password"
            class="login-input"
            :rules="[{ required: true, message: '请填写密码' }]"
          />
          <div
            style="
              text-align: right;
              color: #1989fa;
              margin-top: 20px;
              font-size: 12px;
            "
            @click="_goForgetPassword"
          >
            忘记密码？
          </div>
          <div style="margin: 20px 0">
            <van-button
              round
              block
              type="info"
              native-type="submit"
              @click="login"
            >
              登录
            </van-button>
          </div>
          <div style="text-align: center; font-size: 12px" v-if="!isQyb">
            还没有账号？<span style="color: #1989fa" @click="_goRegister"
              >马上注册</span
            >
          </div>
        </van-form>
      </div>
    </div>
    <div
      style="text-align: center; margin-top: 20px; font-size: 10px"
      @click="_goRegisters"
    >
      {{ Title }}
    </div>
  </div>
</template>

<script>
import { constants } from "crypto";
import { login, qrCodeVerify } from "@/api/public";
import store from "@/store/index";
export default {
  data() {
    return {
      AccountCode: process.env.VUE_APP_TEST_ACCOUNT,
      Password: process.env.VUE_APP_TEST_PASSWORD,
      Title: process.env.VUE_APP_TITLE,
      qrCode: this.$route.query.qrCode,
      paUserID: "",
      isQyb: false,
    };
  },
  created() {
    console.log(localStorage.getItem('sss'))
    
    if (this.$route.query.paUserID) {
      this.paUserID = this.$route.query.paUserID;
    }
    if (process.env.VUE_APP_DEFAULT_PAGE == "/palogin") {
      this.$store.commit("setEnvCode", "qyb");
      this.isQyb = true;
      let title = "安全生产管控平台";
      store.commit("updateTitle", title);
      if (window.Android) {
        window.Android.postMessage(
          JSON.stringify({
            targetName: "Eqb",
            actionName: "hiddenNavgationBar",
            data: {},
            callback: {
              success: "",
            },
          })
        );
      } else if (window.webkit) {
        window.webkit.messageHandlers.EQBNative.postMessage(
          JSON.stringify({
            targetName: "Eqb",
            actionName: "hiddenNavgationBar",
            data: {},
            callback: {
              success: "",
            },
          })
        );
      }
    }
  },
  beforeCreate() {
    document
      .querySelector("body")
      .setAttribute("style", "background-color:#fff");
  },
  beforeDestroy() {
    document.querySelector("body").setAttribute("style", "");
  },
  methods: {
    login() {
      // 请求参数
      let data = {
        AccountCode: this.AccountCode,
        Password: this.Password,
        UserId: this.paUserID,
      };
      if (data.AccountCode && data.Password) {
        login(data).then((res) => {
          if (!res.success) {
            this.$toast(res.errorText);
            return;
          }

          this.$store.commit("setBaseUrl", process.env.VUE_APP_BASE_API);
          // 修改登陆状态
          this.$store.commit("updateLogin", true);
          // 把用户名存入store
          this.$store.commit("updateUserName", res.data.UserName);
          // 把用户名存入store
          this.$store.commit("updateChnName", res.data.ChnName);
          // 保存地址 updateArea
          this.$store.commit("updateArea", res.data.ApplyArea);
          // 保存地址 updateArea
          this.$store.commit("updateCompanySysType", res.data.CompanySysType);
          // 公司code
          this.$store.commit("updateCompanyCode", res.data.CompanyCode);
          // 模块
          this.$store.commit("setCatalogNum", res.data.CatalogNum);
          // 模块
          this.$store.commit("setIsTempUser", res.data.IsTempUser);
          //CompanyType
          this.$store.commit("setCompanyType", res.data.CompanyType);
          this.$store.commit("setDeptCode", res.data.DeptCode);


          // 设备
          this.$store.commit(
            "setHasEquCatalog",
            (res.data.CatalogNum & 32) > 0
          );
          // 拥有风险管控模块
          this.$store.commit(
            "setHasRiskControl",
            (res.data.CatalogNum & 4) > 0
          );
          // 拥有承租户模块
          this.$store.commit(
            "setHasLesseeCatalog",
            (res.data.CatalogNum & 1024) > 0
          );
          // 服务版
          this.$store.commit("setIsFW", ("FW" == res.data.CompanySysType) > 0);
          // 机构版
          this.$store.commit(
            "setIsJGB",
            ("JGB" == res.data.CompanySysType) > 0
          );
          this.$store
            .dispatch("getRoles", res.data.UserKind)
            .then((data) => {
              console.log(data);
            })
            .catch((_) => {
              failure("获取失败");
            });
          this.$toast.success("登录成功");
          setTimeout(() => {
            this.$router.push({
                path: "/index",
                query: {
                  num: Math.ceil(Math.random() * 100000),
                  qrCode:this.qrCode
                },
              });

            // if (this.qrCode) {
            //   qrCodeVerify({ code: this.qrCode }).then((r) => {
            //     if (r.data.Data) {
            //       var retUrl =
            //         "/index?num=" + Math.ceil(Math.random() * 100000);
            //       var qrEntity = JSON.parse(r.data.Data);
            //       switch (r.data.CodeType) {
            //         case "TrainPlan":
            //           retUrl = "/TrainingDetail";
            //           this.$router.push({
            //             path: retUrl,
            //             query: {
            //               PlanCode: qrEntity.Code,
            //               CodeType: r.data.CodeType,
            //             },
            //           });
            //           break;
            //         case "TrainEntrustedPlan":
            //           retUrl = "/TrainingEntrustedDetail";
            //           this.$router.push({
            //             path: retUrl,
            //             query: {
            //               PlanCode: qrEntity.Code,
            //               CodeType: r.data.CodeType,
            //             },
            //           });
            //           break;
            //         case "RU":
            //           retUrl = "/Site_RiskUnit/RiskLocationDetail";
            //           this.$router.push({
            //             path: retUrl,
            //             query: { code: qrEntity.Code },
            //           });
            //           break;
            //         case "Company":
            //           this.$router.push(retUrl);
            //           break;
            //         default:
            //           break;
            //       }
            //     }
            //   });
            // } else {
              
            // }
          }, 1500);
        });
      }
    },
    // 注册
    _goRegister() {
      this.$router.push({
        path: "/registerPhone",
        query:{
          qrCode:this.$router.qrCode
        }
      });
    },
    // 授权
    _goRegisters() {
      this.$router.push("/wxwork");
    },
    // 忘记密码
    _goForgetPassword() {
      this.$router.push("/forgetPassword");
    },
  },
};
</script>

<style lang="less" scoped>
.login-box {
  box-shadow: 2px 2px 6px #ccc;
  border-radius: 20px;
  background-color: #ffffff;
  position: relative;
}

.login-container {
  background: url(/assets/Images/AppIcon/icon_login_top.png) no-repeat;
}

.form-box {
  padding: 20px 20px 20px 20px;
  .phone {
    padding-left: 12px;
    margin-bottom: 10px;
  }
  .password {
    padding: 10px 0 10px 12px;
  }
}
.login-container {
  background-color: #fafafa;
  height: 100vh;
  padding: 100px 20px 0 20px;
  /*font-size: 16px;*/
  color: #000000;
}
.img-box {
  height: 100px;
  width: 100px;
  border: 1px solid #eee;
  padding: 10px;
  box-shadow: 0 0 10px #ddd;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #fff;
  border-radius: 50%;
  overflow: hidden;
}

img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #eee;
}
</style>
<style lang="less">
.login-input {
  padding: 0px;
  input {
    padding: 10px 15px !important;
  }
}
</style>

